<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
	<base href="${pageContext.request.contextPath}/" />
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>Insert title here</title>
	<style>
		/*定义类名为.thead-blue的样式*/
		.thead-blue {
			color: #fff;
			font-weight: bold;
			background-color: #337ab7;
		}
	</style>
	<link rel="stylesheet" type="text/css" href="view/bootstrap-3.3.5/css/bootstrap.css"/>
	<link rel="stylesheet" type="text/css" href="view/bootstrapvalidator/css/bootstrapValidator.css"/>
	<script charset="utf-8" src="view/jquery/jquery-1.10.2.min.js"></script>
	<script charset="utf-8" src="view/bootstrap-3.3.5/js/bootstrap.js"></script>
	<script charset="utf-8" src="view/bootstrapvalidator/js/bootstrapValidator.js"></script>
</head>
<body>

	<!-- 搜索 -->
	<div class="panel panel-primary">
		<div class="panel-heading">
			<h4 class="panel-title">部门搜索</h4>
		</div>
		<div class="panel-body">
			<form action="dept/selectDept" id="seachform" method="post" class="form-horizontal" role="form">
				<div class="form-group">
					<div class="col-md-5">
						<label for="deptName" class="col-md-4 control-label">部门名称</label>
						<div class="col-md-8">
							<input type="text" id="deptName" name="deptName"
								class="form-control" placeholder="请输入部门名称" value="${dept.deptName }">
							<input type="hidden" name="page" id="page" value="${pageBean.page }">
							<input type="hidden" name="pageSize" id="pageSize" value="${pageBean.pageSize }">
						</div>
					</div>
					<div class="col-md-5">
						<label for="phone" class="col-md-4 control-label">部门电话</label>
						<div class="col-md-8">
							<input type="text" id="phone" name="phone"
								class="form-control" placeholder="请输入部门电话"  value="${dept.phone }">
						</div>
					</div>
					<div class="col-md-2">
						<div class="col-md-12">
							 <a type="button" href="dept/toAddDept" class="btn btn-info">添加部门</a>
						</div>
					</div>
				</div>

				<div class="form-group">
					<div class="col-md-5">
						<label for="parentoid" class="col-md-4 control-label">上级部门</label>
						<div class="col-md-8">
							<select name="parentoid" class="form-control" id="parentoid">
								<option value="">--请选择--</option>
								<c:forEach items="${listDept }" var="d">
									<option value="${d.oid }" ${d.oid==dept.parentoid?"selected":"" }>${d.deptName }</option>
								</c:forEach>
							</select>
						</div>
					</div>
					<div class="col-md-5">
						<label for="address" class="col-md-4 control-label">部门地址</label>
						<div class="col-md-8">
							<input type="text" id="address" name="address"
								class="form-control" placeholder="请输入部门地址" value="${dept.address }">
						</div>
					</div>
					<div class="col-md-2">
						<div class="col-md-12">
							 <button type="submit" class="btn btn-success">搜索部门</button>
						</div>
					</div>
				</div>
			</form>
		</div>
	</div>
	
	<div id="alertmsg" class="alert alert-danger" style="text-align: center;" hidden="true"></div>
	
	<!-- 列表 -->
	<div class="panel panel-primary">
		<table class="table table-bordered table-hover">
			<thead>
				<tr class="thead-blue" align="center">
					<td>部门编号</td>
					<td>部门名称</td>
					<td>上级部门</td>
					<td>部门经理</td>
					<td>部门电话</td>
					<td>部门传真</td>
					<td>部门状态</td>
					<td>操作</td>
				</tr>
			</thead>
			<tbody>
				<c:forEach items="${pageBean.data}" var="d">
					<tr align="center">
						<td>${d.oid}</td>
						<td>${d.deptName }</td>
						<td>${d.dept.deptName }</td>
						<td>${d.emp.empName }</td>
						<td>${d.phone }</td>
						<td>${d.fax }</td>
						<td>${d.status=="q"?"可用":"不可用" }</td>
						<td>
							<a type="button" href="dept/deptInfo?oid=${d.oid}" class="btn btn-info btn-xs">详情</a>
							<a type="button" href="dept/toUpdateDept?oid=${d.oid}" class="btn btn-warning btn-xs">修改</a>
							<button type="button" onclick="deleteDept(${d.oid})" class="btn btn-danger btn-xs" data-toggle="modal" data-target="#confirmModal">删除</button>
						</td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
	</div>

	<!-- 分页 -->
	<div class="input-group col-md-6 col-md-offset-3">
		<div class="row">
			<div class="btn-group">
				<button onclick="gotoPage(1,${pageBean.pageSize})" class="btn btn-primary" type="button">首页</button>
				<c:if test="${pageBean.page==1 }">
					<button class="btn btn-primary disabled" type="button">上一页</button>
				</c:if>
				<c:if test="${pageBean.page>1 }">
					<button onclick="gotoPage(${pageBean.page-1},${pageBean.pageSize})" class="btn btn-primary" type="button">上一页</button>
				</c:if>

				<button class="btn btn-primary disabled" type="button">当前第${pageBean.page}/${pageBean.pageCount}页</button>

  				<div class="btn-group">
					<button type="button" class="btn btn-primary dropdown-toggle"
						data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
						每页显示${pageBean.pageSize}条 <span class="caret"></span>
					</button>
					<ul class="dropdown-menu">
						<li><a href="javascript:gotoPage(1,5)">每页显示5条</a></li>
						<li><a href="javascript:gotoPage(1,10)">每页显示10条</a></li>
						<li><a href="javascript:gotoPage(1,15)">每页显示15条</a></li>
						<li><a href="javascript:gotoPage(1,20)">每页显示20条</a></li>
					</ul>
				</div>

				<button class="btn btn-primary disabled" type="button">共${pageBean.rowCount}条记录</button>

				<c:if test="${pageBean.page==pageBean.pageCount }">
					<button class="btn btn-primary disabled" type="button">下一页</button>
				</c:if>
				<c:if test="${pageBean.page<pageBean.pageCount }">
					<button onclick="gotoPage(${pageBean.page+1},${pageBean.pageSize})"  class="btn btn-primary" type="button">下一页</button>
				</c:if>
				<button onclick="gotoPage(${pageBean.pageCount },${pageBean.pageSize})" class="btn btn-primary" type="button">尾页</button>
			</div>
		</div>
	</div>

	<br><br><br>

	<%@include file="../modal/confirm.jsp" %>
</body>
<script type="text/javascript">
function gotoPage(page,pageSize){
	$("#page").val(page);
	$("#pageSize").val(pageSize);
	$("#seachform").submit();
}

var deleteoid;
function deleteDept(oid){
	deleteoid = oid;
}
function deleteConfirm(){
	$.get("dept/deleteDept",{"oid":deleteoid},function(s){
		if(s==true){
			document.location.href="dept/selectDept";
		}else{
			$("#alertmsg").text("删除失败!当前部门正在使用!");
	        $("#alertmsg").slideDown();
	        $("#alertmsg").delay(2000).slideUp();
		}
	}).complete(function(xhr) {
		if(xhr.status=="403"){//没有权限
			document.location.href = xhr.getResponseHeader("url");
		}else if(xhr.status!="200"){
			console.log("服务器错误!");
		}
	});

}
</script>
</html>